.page-wrap {
  height: 100%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #f7f7f7;

  .page-container {
    width: 450rem;
    padding: 40rem 50rem;
    background: white;
    box-sizing: border-box;
    border-radius: 20rem;
    box-shadow: 40rem 60rem 20rem rgba(0, 0, 0, 0.2);

    .container-header {

      .header-icon {
        width: 75rem;
        height: 75rem;
        border-radius: 100%;
        margin: 0 auto;
      }

      .header-text {
        width: 75rem;
        height: 75rem;
        color: white;
        line-height: 75rem;
        background: #043bff;
        text-align: center;
        font-size: 28rem;
        margin: 0 auto;
        border-radius: 50%;
      }

      .header-title {
        margin-top: 5rem;
        text-align: center;
        font-size: 36rem;
        font-weight: 500;
        line-height: 75rem;
      }
    }

    .container-title {
      margin-top: 10rem;
      font-size: 18rem;
      font-weight: 600;
    }

    .container-form {
      margin-top: 20rem;

      .form-item {
        margin-bottom: 20rem;
        padding: 8rem 15rem;
        box-sizing: border-box;
        background: #f1f1f1;
        border-radius: 20rem;
        border: #dddddd 1rem solid;
        display: flex;

        .item-img {
          margin: 5rem 0;
          flex: 0;
          flex-basis: 30rem;
          width: 20rem;
          height: 20rem;
        }

        :deep(.el-input__wrapper) {
          flex: 1;
          height: 32rem;
          line-height: 32rem;
          margin: 0 10rem;
          background: none;
          box-shadow: none;
          padding: 0;
          font-size: 18rem;

          .el-input__inner {
            height: 32rem;
            line-height: 32rem;
          }
        }
      }

      .form-code {
        display: flex;

        .form-item {
          flex: 1;
          margin-bottom: 0;
          margin-right: 10rem;
        }

        .form-code-logout {
          margin-top: 5rem;
        }
      }
    }

    .container-login {
      margin-top: 30rem;
      height: 42rem;
      line-height: 42rem;

      :deep(.el-button) {
        height: 42rem;
        width: 100%;
        padding: 0;
        font-size: 20rem;
        line-height: 42rem;
        background-color: #043bff;
      }

      :deep(.el-button:hover) {
        background-color: #6086fb;
      }
    }
  }

  .page-footer {
    white-space: nowrap;
    position: fixed;
    bottom: 0;
    width: 100%;
    text-align: center;

    .footer-copyright {
      font-size: 16rem;
      line-height: 20rem;
    }

    .footer-ICP {
      cursor: pointer;
      font-size: 14rem;
    }

    .footer-ICP:hover {
      color: blue;
    }
  }

  @media (min-width: 600rem) {
    .page-container {
      min-width: 500rem;
      width: 500rem;
      height: 600rem;
      padding: 65rem 70rem 30rem 70rem;

      .container-title {
        margin-top: 20rem;
      }

      .container-login {
        margin-top: 40rem;
      }
    }
  }
}



